<template>
  <div
    :class="{
      'pui-tag': true,
      'default': type === 'default',
      'primary': type === 'primary',
      'success': type === 'success',
      'info': type === 'info',
      'warning': type === 'warning',
      'danger': type === 'danger',
      'large': size === 'large',
      'plain': plain && type && type !== 'default',
      'round': round,
      'circle': circle,
    }"
  >
    <slot></slot>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  name: 'pui-tag',
});
</script>

<script setup lang="ts">
import type { Props } from './interface';

withDefaults(defineProps<Props>(), {
  type: 'default',
  size: 'normal',
  display: 'inline',
  plain: false,
  round: false,
  circle: false,
});
</script>
